<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<c:set var="contextPath" value="<%=request.getContextPath()%>"></c:set>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
	<title>科目考试</title>	
	
<style type="text/css">
.testDescription {
    margin: 20px 0 0;
    padding: 10px 20px;
    background-color: #feffd1;
    font-size: 15px;
    color: #666;
}
.testDescription span{
	font-weight: 700;
}
</style>
	
</head>

<body>

	 <!-- /section:basics/sidebar -->
	<div class="main-content">
		<!-- #section:basics/content.breadcrumbs -->
		<div class="breadcrumbs" id="breadcrumbs">
			<script type="text/javascript">
				try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}
			</script>

			<ul class="breadcrumb">
				<li>
					<i class="ace-icon fa fa-home home-icon"></i>
					<a href="">Home</a>
				</li>

				<li>
					<a href="#">Tables</a>
				</li>
				<li class="active">Simple &amp; Dynamic</li>
			</ul><!-- /.breadcrumb -->

			<!-- #section:basics/content.searchbox -->
			<div class="nav-search" id="nav-search">
				<form class="form-search">
					<span class="input-icon">
						<input type="text" placeholder="Search ..." class="nav-search-input" id="nav-search-input" autocomplete="off" />
						<i class="ace-icon fa fa-search nav-search-icon"></i>
					</span>
				</form>
			</div><!-- /.nav-search -->

			<!-- /section:basics/content.searchbox -->
		</div>

		<!-- /section:basics/content.breadcrumbs -->
		<div class="page-content">
			<!-- /section:settings.box -->
			<div class="page-content-area">
				<div class="page-header">
					<h1>
						科目考试:&nbsp;&nbsp;<B> ${sub.name }</B>
						
					</h1>
				</div><!-- /.page-header -->


	<!-- /section:settings.box -->
		<div class="page-content-area">
			<div class="page-header">
			<div class="testDescription">
			<h5>本次考试的参考时长为:&nbsp;&nbsp;<span id="testTimer">${sub.totalTime } </span>&nbsp;&nbsp;&nbsp;&nbsp;总分为:&nbsp;&nbsp;<span id="testScore">${sub.totalScore }</span>&nbsp;&nbsp;分</h5>
			</div>
			</div><!-- /.page-header --> 

				<div class="row">
					<form id="test-form" action="${pageContext.request.contextPath}/student/assignment" method="post">
					     <input type="hidden" name="userId" value="${examUser.userId }" />
						<input type="hidden" name="subId" value="${sub.subId }" />  
					
						<c:forEach items="${testListMap }" var="examTests">
							<c:choose>
								<c:when test="${examTests.key == 1 }">
									<sqan><B>单选题：</B> 每题：50分</sqan>  
									<c:forEach items="${examTests.value }" var="examTest">
										<h5>${examTest.content }</h5>
										<h6>
											<input type="radio" name="test_${examTest.id }" value="A" />${examTest.chooseA }&nbsp;&nbsp;&nbsp;
											<input type="radio" name="test_${examTest.id }" value="B" />${examTest.chooseB }&nbsp;&nbsp;&nbsp;
											<input type="radio" name="test_${examTest.id }" value="C" />${examTest.chooseC }&nbsp;&nbsp;&nbsp;
											<input type="radio" name="test_${examTest.id }" value="D" />${examTest.chooseD }&nbsp;&nbsp;&nbsp;
										</h6>
									</c:forEach>
									<hr/>
								</c:when>
								
								<c:when test="${examTests.key == 2 }">
									<span><B>双选题：</B> 每题：50分</span> 
									<c:forEach items="${examTests.value }" var="examTest">
										<h5>${examTest.content }</h5>
										<p>
											<input type="checkbox" name="test_${examTest.id }" value="A" />${examTest.chooseA }&nbsp;&nbsp;&nbsp;
											<input type="checkbox" name="test_${examTest.id }" value="B" />${examTest.chooseB }&nbsp;&nbsp;&nbsp;
											<input type="checkbox" name="test_${examTest.id }" value="C" />${examTest.chooseC }&nbsp;&nbsp;&nbsp;
											<input type="checkbox" name="test_${examTest.id }" value="D" />${examTest.chooseD }&nbsp;&nbsp;&nbsp;
										</p>
									</c:forEach>
									<hr/>
								</c:when>
							</c:choose>
						</c:forEach>
						<button id="submitTestBtn" type="button" class="btn btn-primary">交卷</button>
					</form>
				</div>
			</div>
		</div>
		
		<!-- <script type="text/javascript">
			$(function(){
				$('#stuTestBtn').click(function(){
					$('#stuTestForm input[]')
				});
			});
		</script> -->

	</div>
	
	<script type="text/javascript">
	$(function(){
		function initTimer(){
			var resultTime = 0;
			var testTotalTime = Number('${sub.totalTime}');
			return testTotalTime * 60;
		}
		function statrtTimer(totalSecend){
			$('#testTimer').text(formatTime(totalSecend));
			var timer = setInterval(function(){
				totalSecend --;
				if(totalSecend >= 0){
					$('#testTimer').text(formatTime(totalSecend));
				}else{
					alert('考试结束!');
					clearInterval(timer);
					assignment();
				}
			}, 1000);
		}
		function formatTime(totalSecend){
			var hour = Math.floor(totalSecend / 3600);
			var min = Math.floor((totalSecend % 3600) / 60);
			var secend = Math.floor(totalSecend % 60);
			hour = formatTimeNumber(hour);
			min = formatTimeNumber(min);
			secend = formatTimeNumber(secend);
			return hour + ':' + min + ':' + secend;
		}

		function formatTimeNumber(timeNumber){
			if(timeNumber < 10){
				return "0" + timeNumber;
			} else {
				return timeNumber;
			}
		}

		function assignment(){
			$('#test-form').submit();
		}
		
		$('#submitTestBtn').click(function(){
			if(confirm("是否确认提交？")){
				assignment();
			}
		});
		statrtTimer(initTimer());
	})
	
</script>	
	
	
</body>
</html>